<template>
  <div>
    <el-row :gutter="20">
      <el-col :span="4">
        <el-tree ref="orgTree" :data="treeData" node-key="id" :expand-on-click-node="false" default-expand-all  highlight-current @node-click="treeClick"></el-tree>
      </el-col>
      <el-col :span="20">
        <user :key="'user' + activeOrgId" :orgId="activeOrgId"></user>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import request from "@/utils/request";
import user from "@/views/sys/user/user";
export default {
  components : {user},
  data() {
    return {
      treeData : [],
      activeOrgId:0,
    }
  },
  mounted() {
    this.loadOrgTree();
  },
  methods: {
    loadOrgTree(){
      request({
        url: '/sys/org/orgtreedata',
        data: {orgId : 1}
      }).then(res => {
        const { data } = res
        this.treeData = data
        if(this.treeData.length > 0){
          this.activeOrgId = this.treeData[0].id
        }
      })
    },
    treeClick(treeNode){
      this.activeOrgId=parseInt(treeNode.id)
    }
  }
}
</script>

<style scoped>
</style>
